<style>
    .layui-table-col-special .layui-table-cell {
        height: auto;
        overflow: visible;
        text-overflow: inherit;
        white-space: normal;
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">类型</label>
                    <div class="layui-input-block">
                        <select name="alternative_id" lay-search="">
                            <option value="">请选择类型</option>
                            {foreach $alternative as $key=>$vo}
                            <option value="{$vo.id}">{$vo.title}</option>
                            {/foreach}
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">人员名称</label>
                    <div class="layui-input-block">
                        <select name="admin_id" lay-search="">
                            <option value="">请选择人员名称</option>
                            {foreach $admin as $key=>$vo}
                            <option value="{$vo.id}">{$vo.nickname}</option>
                            {/foreach}
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">所属部门</label>
                    <div class="layui-input-block">
                        <select name="group_id" lay-search="">
                            <option value="">请选择所属部门</option>
                            {foreach $va_group as $key=>$vo}
                            <option value="{$vo.group_id}">{$vo.group_name}</option>
                            {/foreach}
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">开始时间</label>
                    <div class="layui-input-block">
                        <input type="text" name="start_time" id="start_time" placeholder="请输入开始时间" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">结束时间</label>
                    <div class="layui-input-block">
                        <input type="text" name="end_time" id="end_time" placeholder="请输入结束时间" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn layuiadmin-btn-admin" lay-submit lay-filter="LAY-user-back-search">
                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                    </button>
                </div>
            </div>
        </div>
        <div class="layui-card-body">
            <div style="padding-bottom: 10px;">
                <button class="layui-btn layuiadmin-btn-admin layui-btn-sm" title="刷新" data-type="refresh"><i
                        class="layui-icon layui-icon-refresh-3"></i>
                </button>
                <button class="layui-btn layuiadmin-btn-admin layui-btn-sm {$auth->check('vacation/export')?$auth->check('vacation/export'):'hide'}"
                        title="导出" data-type="export"><i
                        class="layui-icon layui-icon-add-1"></i>导出
                </button>
                <!--                <button class="layui-btn layuiadmin-btn-admin layui-btn-sm {$auth->check('journal/del')?$auth->check('journal/del'):'hide'}"-->
                <!--                        title="删除" data-type="batchdel"><i-->
                <!--                        class="layui-icon layui-icon-delete"></i>删除-->
                <!--                </button>-->
            </div>
            <table id="LAY-user-back-manage" lay-filter="LAY-user-back-manage"></table>
        </div>
    </div>
</div>
<script src="/static/layuiadmin/layui/layui.js"></script>
<script>
    var listUrl = "{:url('vacation/checkTable')}", downloadExportUrl = "{:url('vacation/download')}",VacationDetail = "{:url('vacation/VacationDetail')}";
    layui.config({
        base: '/static/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'table', 'soulTable', 'laydate'], function () {
        var $ = layui.$
            , form = layui.form
            , table = layui.table, soulTable = layui.soulTable, laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#start_time' //指定元素
            , trigger: 'click'//呼出事件改成click
        });
        laydate.render({
            elem: '#end_time' //指定元素
            , trigger: 'click'//呼出事件改成click
        });
        table.render({
            elem: "#LAY-user-back-manage", url: listUrl
            , overflow: {
                type: 'tips'
                // ,hoverTime: 500 // 悬停时间，单位ms, 悬停 hoverTime 后才会显示，默认为 0
                , color: 'white' // 字体颜色
                , bgColor: '#009688' // 背景色
            }
            , cols: [
                [
                    {type: "checkbox", fixed: "left"},
                    {field: "alternative_title", align: "center", title: "类型"},
                    {field: "username", align: "center", title: "人员名称"},
                    {field: "group_name", align: "center", title: "所属部门"},
                    {field: "day", align: "center", title: "小时数"},
                    {field: "corresponding", align: "center", title: "对应"},
                    {field: "start_time", align: "center", title: "开始时间"},
                    {field: "end_time", align: "center", title: "结束时间"},

                    {field: "create_time", align: "center", title: "填写日期"}
                ]],
            response: {
                statusCode: 200 //重新规定成功的状态码为 200，table 组件默认为 0
            }, done: function (e) {
                soulTable.render(this);
                var id = $('#id').val();
                // e.data.forEach(function (element) {
                //     if (id != element.admin_id) {
                //         $(".layui-table").find("[data-field='status']").css("display","none");
                //     }
                // });

            },
            parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
                return {
                    "code": res.code,
                    "count": res.total, //解析数据长度
                    "data": res.data, //解析数据列表
                };

            },
            text: {
                none: '呀！一条数据都没有'
            },

            page: true,
            limit: 10,
        });

        //监听搜索
        form.on('submit(LAY-user-back-search)', function (data) {
            var field = data.field;
            //执行重载
            table.reload('LAY-user-back-manage', {
                where: field
            });
        });
        //监听行单击事件（双击事件为：rowDouble）
        table.on('row(LAY-user-back-manage)', function(obj) {
            var data = obj.data.id;
            var param = $.param({'id': obj.data.id});
            layer.open({
                type: 2
                , skin: 'layui-layer-molv'
                , title: '查看'
                , content: VacationDetail + '?' + param
                , area: ['100%', '100%']
                , maxmin: true
            });
        });
        //事件
        var active = {
            refresh: function () {
                table.reload('LAY-user-back-manage');
            },
            export: function () {
                var checkStatus = table.checkStatus('LAY-user-back-manage')
                    , checkData = checkStatus.data; //得到选中的数据
                var id = ''; //task_id
                for (var i = 0; i < checkData.length; i++) {
                    id += checkData[i].id + ",";
                }
                id = id.substring(0, id.length - 1);
                layer.confirm('确定导出数据吗？', function (index) {
                    //执行 Ajax 后重载
                    $.ajax({
                        url: downloadExportUrl,
                        type: "post",
                        data: {
                            ids: id
                        },
                        beforeSend: function () {
                            layer.load(2, {
                                shade: [0.6, '#fff'], content: '数据导出中...', success: function (layero) {
                                    layero.find('.layui-layer-content').css({
                                        'padding-top': '6px',
                                        'width': '150px',
                                        'padding-left': '40px'
                                    });
                                    layero.find('.layui-layer-ico16, .layui-layer-loading .layui-layer-loading2').css({
                                        'width': '150px !important',
                                        'background-position': '2px 0 !important'
                                    });
                                }
                            });
                        },
                        success: function (res) {
                            if (res.code === 400) {
                                layer.msg(res.message, {icon: 5}, function () {
                                    layer.closeAll();
                                });
                                return false;
                            } else {
                                var dataObj = eval("(" + res + ")");
                                if (dataObj.code == 200) {
                                    layer.closeAll();
                                    window.location.href = dataObj.url;
                                } else {
                                    layer.msg("暂无查询到有效数据", {icon: 5});
                                    return false;
                                }
                            }
                        }
                    });
                    // table.reload('LAY-user-back-manage');
                    // layer.msg('已删除');
                });
            }

        };
        $('.layui-btn.layuiadmin-btn-admin').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });
</script>
